<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>xxxx详情</title>
    <link rel="stylesheet" href="css/theme.css">
    <link rel="stylesheet" href="./css/news_reading.css">
</head>
<!-- https://www.163.com/dy/article/GPH7LB7R05346RC6.html -->

<body class="reading_page">
    <div class="reading_container">
        <div class="reading_context">
            <div class="reading_tiitle_div">
                <h1 id="h1">title</h1>
                <span id="blog_info">发布日期：2021年11月23日 &nbsp;&nbsp;&nbsp; 阅读：1000 &nbsp;&nbsp;&nbsp; 点赞：300</span>
            </div>
            <div class="reading_detail" id="reading_detail">
                <!-- 内容填充 -->
            </div>
            <div class="reading_bottom">
                <span id="btn_thumb"><img src="/img/like.png" alt=""> 点赞</span>
                <span><img src="/img/Star.png" alt="">收藏</span>
                <span><img src="/img/Police.png" alt="">举报</span>
            </div>
        </div>
    </div>
    <script>

        let btnThumb = document.getElementById('btn_thumb')

        fetch('/blog/' + getQueryVariable('id'), { method: 'get' }).then(resp => {
            resp.json().then(data => {
                document.title = data.title
                document.getElementById('h1').textContent = data.title
                document.getElementById('blog_info').textContent = '发布日期：' + data.date +
                    '  | 阅读：' + data.reading + '  | 点赞：' + data.thumb
                document.getElementById('reading_detail').innerHTML = data.content
                btnThumb.textContent = '点赞：' + data.thumb
            })
        })

        btnThumb.addEventListener('click', () => {
            fetch('/blog/thumbUp/' + getQueryVariable('id'), { method: 'put' }).then(resp => {
                resp.json().then(data => {
                    if (data.code == 200) {
                        btnThumb.textContent = '点赞：' + data.thumb
                    }
                })
            })
        })


        function getQueryVariable(variable) {
            var query = window.location.search.substring(1);
            var vars = query.split("&");
            for (var i = 0; i < vars.length; i++) {
                var pair = vars[i].split("=");
                if (pair[0] == variable) { return pair[1]; }
            }
            return (false);
        }
    </script>
</body>

</html>